<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>当当列表页</title>
    <link
      rel="shortcut icon"
      href="http://www.dangdang.com/favicon.ico"
      type="image/x-icon"
    />
    <link rel="stylesheet" href="../font/iconfont.css" />
    <link rel="stylesheet" href="../css/base.css" />
    <link rel="stylesheet" href="../src/css/layui.css" />
    <link rel="stylesheet" href="../css/list.css" />
  </head>
  <body>
    <!-- 头部 -->
    <header>
      <!-- 导航 -->
      <div id="tools">
        <div class="wrapper clearfix">
          <!-- 送货地点 -->
          <div class="left l">
            <a href="javascript:;" class="go-where"></a>
            <ul class="province"></ul>
          </div>
          <!-- 导航右边 -->
          <div class="right r">
            <div class="welcome r">
              <span class="login1">
                欢迎光临当当，请
                <a href="../html/login.html" class="login">登录</a>
                <span>成为会员</span>
              </span>
              <ul class="nav-right r"></ul>
            </div>
          </div>
        </div>
      </div>
      <!-- logo图标 -->
      <div id="logo">
        <img src="../images/listImages/DDlogoNEW.gif" alt="" />
        <input type="text" placeholder="神奇校车" />
        <section class="search">
          <span></span>
          <div class="select_pop"></div>
        </section>
        <button></button>
        <div class="search_bottom"></div>
        <div class="char">
          <a href="../html/shopping.html">购物车</a><b></b>
        </div>
        <div class="dd">我的订单</div>
      </div>
      <!-- 商品分类 -->
      <nav>
        <ul class="nav_list wrapper">
          <li class="all"><a href="javascript:;">全部商品分类</a></li>
        </ul>
      </nav>
    </header>
    <!-- 主体 -->
    <main>
      <div class="main_list">
        <ul class="wrapper">
          <li><a href="javascript:;">童书榜</a></li>
          <li><a href="javascript:;">女装热卖</a></li>
          <li><a href="javascript:;">男士服装</a></li>
          <li><a href="javascript:;">童装</a></li>
          <li><a href="javascript:;">运动户外</a></li>
          <li><a href="javascript:;">帆布鞋</a></li>
          <li><a href="javascript:;">箱包皮具</a></li>
          <li><a href="javascript:;">奶粉</a></li>
          <li><a href="javascript:;">美妆</a></li>
          <li><a href="javascript:;">玩具童车</a></li>
          <li><a href="javascript:;">电子教育</a></li>
        </ul>
      </div>
      <section>
        <div class="top">
          <div class="one">
            <a href="javascript:;">全部<span>></span></a>
            <a href="javascript:;">珠宝首饰</a>
            <a href="javascript:;">共<span>256</span>件商品</a>
          </div>
          <div class="two">
            <ul>
              <li>
                <div class="left l">分类</div>
                <div class="right r">
                  <a href="javascript:;">流行饰品</a>
                  <a href="javascript:;">翡翠玉石</a>
                  <a href="javascript:;">黄/铂/K金饰品</a>
                  <a href="javascript:;">水晶玛瑙</a>
                  <a href="javascript:;">银饰</a>
                  <a href="javascript:;">彩宝</a>
                  <a href="javascript:;">珍珠</a>
                </div>
              </li>
              <li>
                <div class="left l">品牌</div>
                <div class="right r">
                  <a href="javascript:;">六福珠宝</a>
                  <a href="javascript:;">梦克拉</a>
                  <a href="javascript:;">艾贝</a>
                  <a href="javascript:;">网易严选</a>
                </div>
              </li>
              <li>
                <div class="left l">价格</div>
                <div class="right r">
                  <a href="javascript:;">0-89</a>
                  <a href="javascript:;">89-239</a>
                  <a href="javascript:;">239-759</a>
                  <a href="javascript:;">759-1749</a>
                  <a href="javascript:;">1749以上</a>
                </div>
              </li>
              <li>
                <div class="left l">材质</div>
                <div class="right r">
                  <a href="javascript:;">黄金</a>
                  <a href="javascript:;">翡翠</a>
                  <a href="javascript:;">金属</a>
                  <a href="javascript:;">铂金镶钻</a>
                  <a href="javascript:;">金</a>
                  <a href="javascript:;">999千足银</a>
                  <a href="javascript:;">K金镶钻</a>
                </div>
              </li>
              <li>
                <div class="left l">适用人群</div>
                <div class="right r">
                  <a href="javascript:;">男</a>
                  <a href="javascript:;">女</a>
                  <a href="javascript:;">情侣</a>
                </div>
              </li>
            </ul>
          </div>
          <div class="three">
            <a href="javascript:;">更多选项（类别、款式、是否镶嵌、风格等）</a>
          </div>
          <div class="four">
            <ul class="clearfix">
              <li>综合排序</li>
              <li>销量<i class="iconfont icon-xiajiang"></i></li>
              <li>好评 <i class="iconfont icon-xiajiang"></i></li>
              <li>最新 <i class="iconfont icon-xiajiang"></i></li>
              <li>价格<i class="iconfont icon-shangxiajiantou"></i></li>
              <li>
                <input type="text" value="￥" />
                -
                <input type="text" value="￥" />
              </li>
              <li>
                配送至:
                <input
                  type="text"
                  value="北京"
                  style="text-align: center; width: 64px"
                />
              </li>
              <li class="m c"><input type="checkbox" />当当发货</li>
              <li class="m c"><input type="checkbox" />只看有货</li>
              <li class="m c"><input type="checkbox" />促销</li>
              <li class="m c"><input type="checkbox" />预售</li>
              <li>
                <img src="../images/listImages/1.jpg" alt="" /><span
                  style="color: red"
                  >1</span
                >/18<img src="../images/listImages/2.jpg" alt="" />
              </li>
              <li><i class="iconfont icon-liebiao"></i> 列表</li>
              <li><i class="iconfont icon-yingyongzhongxin"></i> 大图</li>
            </ul>
          </div>
        </div>
      </section>

      <div class="main_item wrapper clearfix">
        <div class="main_item_left"></div>

        <div class="main_item_right">
          <h3>推广商品</h3>
          <ul class="list">
            <li>
              <img src="../images/listImages/697265634-3_b_8.jpg" alt="" />
              <p>加绒加厚保暖纯棉长袖衬衫男装牛津</p>
              <p>纺磨毛冬季合体宽松商务休闲衬衣</p>
              <p>¥158.00</p>
              <p>劵</p>
            </li>
          </ul>
          <ul class="list">
            <li>
              <img src="../images/listImages/19.jpg" alt="" />
              <p>羽绒保暖长抽村杉男土2021秋新款</p>
              <p>时尚商务青中年休闲格子寸衫外套</p>
              <p>¥258.00</p>
              <p>劵</p>
            </li>
          </ul>
          <ul class="list">
            <li>
              <img src="../images/listImages/20.jpg" alt="" />
              <p>全棉牛津纺长袖衬衫男装春秋季中青</p>
              <p>年宽松纯色大码素色衬寸衣伯克</p>
              <p>¥118.00</p>
              <p>劵</p>
            </li>
          </ul>
          <ul class="list">
            <li>
              <img src="../images/listImages/21.jpg" alt="" />
              <p>珠宝传奇I浮华与金戈+珠宝圣经+70</p>
              <p>00年珠宝史全3册珠宝玉石贵金</p>
              <p>¥237.00</p>
              <p>劵</p>
            </li>
          </ul>
          <ul class="list">
            <li>
              <img src="../images/listImages/22.jpg" alt="" />
              <p>套装2册首饰设计+首饰艺术设计(第</p>
              <p>2版)珠宝玉石等综合材料应用手</p>
              <p>¥103.00</p>
              <p>劵</p>
            </li>
          </ul>
          <ul class="list">
            <li>
              <img src="../images/listImages/697265634-3_b_8.jpg" alt="" />
              <p>加绒加厚保暖纯棉长袖衬衫男装牛津</p>
              <p>纺磨毛冬季合体宽松商务休闲衬衣</p>
              <p>¥158.00</p>
              <p>劵</p>
            </li>
          </ul>
          <ul class="list">
            <li>
              <img src="../images/listImages/19.jpg" alt="" />
              <p>羽绒保暖长抽村杉男土2021秋新款</p>
              <p>时尚商务青中年休闲格子寸衫外套</p>
              <p>¥258.00</p>
              <p>劵</p>
            </li>
          </ul>
          <ul class="list">
            <li>
              <img src="../images/listImages/20.jpg" alt="" />
              <p>全棉牛津纺长袖衬衫男装春秋季中青</p>
              <p>年宽松纯色大码素色衬寸衣伯克</p>
              <p>¥118.00</p>
              <p>劵</p>
            </li>
          </ul>
          <ul class="list">
            <li>
              <img src="../images/listImages/21.jpg" alt="" />
              <p>珠宝传奇I浮华与金戈+珠宝圣经+70</p>
              <p>00年珠宝史全3册珠宝玉石贵金</p>
              <p>¥237.00</p>
              <p>劵</p>
            </li>
          </ul>
          <ul class="list">
            <li>
              <img src="../images/listImages/22.jpg" alt="" />
              <p>套装2册首饰设计+首饰艺术设计(第</p>
              <p>2版)珠宝玉石等综合材料应用手</p>
              <p>¥103.00</p>
              <p>劵</p>
            </li>
          </ul>
          <ul class="list">
            <li>
              <img src="../images/listImages/697265634-3_b_8.jpg" alt="" />
              <p>加绒加厚保暖纯棉长袖衬衫男装牛津</p>
              <p>纺磨毛冬季合体宽松商务休闲衬衣</p>
              <p>¥158.00</p>
              <p>劵</p>
            </li>
          </ul>
          <ul class="list">
            <li>
              <img src="../images/listImages/19.jpg" alt="" />
              <p>羽绒保暖长抽村杉男土2021秋新款</p>
              <p>时尚商务青中年休闲格子寸衫外套</p>
              <p>¥258.00</p>
              <p>劵</p>
            </li>
          </ul>
          <ul class="list">
            <li>
              <img src="../images/listImages/20.jpg" alt="" />
              <p>全棉牛津纺长袖衬衫男装春秋季中青</p>
              <p>年宽松纯色大码素色衬寸衣伯克</p>
              <p>¥118.00</p>
              <p>劵</p>
            </li>
          </ul>
          <ul class="list">
            <li>
              <img src="../images/listImages/21.jpg" alt="" />
              <p>珠宝传奇I浮华与金戈+珠宝圣经+70</p>
              <p>00年珠宝史全3册珠宝玉石贵金</p>
              <p>¥237.00</p>
              <p>劵</p>
            </li>
          </ul>
        </div>
        <div id="paging" class="con clearfix"></div>
        <div class="reco_wrap">
          <div class="top">
            <a href="javascript:;">推广商品</a>
            <a href="javascript:;">根据您的浏览历史为您推荐</a>
          </div>
          <div class="tag">
            <ul>
              <li>
                <img src="../images/listImages/643666798-1_b_1.jpg" alt="" />
                <p>图案基础 张繁荣 张翠莲</p>
                <p>【稀缺旧书】</p>
                <p><span>¥18.29</span><b>定价：</b><i>73.86</i></p>
                <span></span>
                <p>满30-1</p>
              </li>
              <li>
                <img src="../images/listImages/01.jpg" alt="" />
                <p>设计透视基础张旗、张宇彤</p>
                <p>张路光、成红军[正版图</p>
                <p><span>¥65.81</span><b>定价：</b><i>216.42</i></p>
                <span></span>
              </li>
              <li>
                <img src="../images/listImages/02.jpg" alt="" />
                <p>钢琴即兴伴奏基础教程【出版</p>
                <p>社样书】李小琪杨小龙范文【</p>
                <p><span>¥22.79</span><b>定价：</b><i>60.00</i></p>
                <span></span>
                <p>满30-1</p>
              </li>
              <li>
                <img src="../images/listImages/03.jpg" alt="" />
                <p>图案与表现 郑军【正版图书</p>
                <p>】</p>
                <p><span>¥19.82</span><b>定价：</b><i>60.06</i></p>
                <span></span>
                <p>满30-1</p>
              </li>
              <li>
                <img src="../images/listImages/04.jpg" alt="" />
                <p>钩出超人气毛线衫和小饰品 日本靓</p>
                <p>丽出版社 9787537564311 河北科</p>
                <p><span>¥57.00</span><b>定价：</b><i>57.05</i></p>
                <span></span>
              </li>
              <li>
                <img src="../images/listImages/05.jpg" alt="" />
                <p>创意中国结挂饰配饰饰品L6 谢海斌</p>
                <p>　编著 9787535633460 湖南美术</p>
                <p><span>¥13.90</span><b>定价：</b><i>28.05</i></p>
                <span></span>
              </li>
              <li>
                <img src="../images/listImages/06.jpg" alt="" />
                <p>中国硬笔行书基础一点通 丁永康</p>
                <p>中国硬笔行书基础一点通</p>
                <p><span>¥14.87</span><b>定价：</b><i>45.15</i></p>
                <span></span>
                <p>满30-1</p>
              </li>
              <li>
                <img src="../images/listImages/07.jpg" alt="" />
                <p>君君卡通 千姿百态的美少女 柴小</p>
                <p>君君卡通 千姿百态的美少女 柴小</p>
                <p><span>¥6.80</span><b>定价：</b><i>16.00</i></p>
                <span></span>
                <p>满30-1</p>
              </li>
              <li>
                <img src="../images/listImages/08.jpg" alt="" />
                <p>幻镜 梦幻系古风色铅笔入门 飞乐鸟</p>
                <p>工作室【正版图书】</p>
                <p><span>¥33.37</span><b>定价：</b><i>100.71</i></p>
                <span></span>
              </li>
              <li>
                <img src="../images/listImages/09.jpg" alt="" />
                <p>【大16开】素描基础教程结构与光影</p>
                <p>表现（光影表现篇结构技法篇两册</p>
                <p><span>¥144.14</span><b>定价：</b><i>450.42</i></p>
                <span></span>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </main>
    <!-- 底部 -->
    <footer>
      <div class="top">
        <div class="footer_top">
          <a href="javascript:;">
            <span></span>
          </a>
          <a href="javascript:;">
            <span></span>
          </a>
          <a href="javascript:;">
            <span></span>
          </a>
        </div>
      </div>
      <div class="cont">
        <div>
          <span>购物指南</span>
          <ul>
            <li>购物流程</li>
            <li>发票制度</li>
            <li>服务协议</li>
            <li>会员优惠</li>
          </ul>
        </div>
        <div>
          <span>支付方式</span>
          <ul>
            <li>网上支付</li>
            <li>礼品卡支付</li>
            <li>银行转账</li>
            <li>礼券支付</li>
          </ul>
        </div>
        <div>
          <span>订单服务</span>
          <ul>
            <li>配送服务查询</li>
            <li>订单状态说明</li>
            <li>自动取消订单</li>
            <li>自助修改订单</li>
          </ul>
        </div>
        <div>
          <span>配送方式</span>
          <ul>
            <li>当日递</li>
            <li>次日达</li>
            <li>订单自提</li>
            <li>验货与签收</li>
          </ul>
        </div>
        <div>
          <span>退换货</span>
          <ul>
            <li>退换货服务查询</li>
            <li>自助申请退换货</li>
            <li>退换货进度查询</li>
            <li>退款方式和时间</li>
          </ul>
        </div>
        <div>
          <span>商家服务</span>
          <ul>
            <li>商家中心</li>
            <li>运营服务</li>
          </ul>
        </div>
      </div>
      <div class="foot">
        <div class="footer_nav">
          <a href="javascript:;">公司简介</a>
          <span class="sep">|</span>
          <a href="javascript:;">诚聘英才</a>
          <span class="sep">|</span>
          <a href="javascript:;">网站联盟</a>
          <span class="sep">|</span>
          <a href="javascript:;">当当招商</a>
          <span class="sep">|</span>
          <a href="javascript:;">机构销售</a>
          <span class="sep">|</span>
          <a href="javascript:;">手机当当</a>
          <span class="sep">|</span>
          <a href="javascript:;">官方Blog</a>
          <span class="sep">|</span>
          <a href="javascript:;">热词搜索</a>
        </div>
        <div class="footer_copyright">
          <span>Copyright 2004 - 2021 当当网. All Rights Reserved</span>
          <span class="sep">|</span>
          <span>京ICP备17043473号-1</span>
          <a href="javascript:;"
            ><img src="../images/listImages/validate.gif" alt=""
          /></a>
          <span>京ICP证041189号</span>
          <span class="sep">|</span>
          <span>出版物经营许可证 新出发京批字第直0673号</span>
        </div>
      </div>
    </footer>

    <div class="f_box">
      <div class="ewm"></div>
      <div class="yijian"></div>
      <div class="fanhui"></div>
    </div>
    <div class="ggd">广告</div>
    <script src="../js/jquery.min.js"></script>
    <script src="../js/ajax.js"></script>
    <script src="../src/layui.js"></script>
    <script src="../js/list.js"></script>
  </body>
</html>
